<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="../../resources/js/jquery-1.6.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery.form.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-validation-1.8.0/jquery.validate.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-validation-1.8.0/additional-methods.js"></script>
    <script type="text/javascript" src="../../resources/js/jquery-ui-1.8.11.custom.min.js"></script>
    <script type="text/javascript" src="../../resources/js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <script type="text/javascript" src="../../resources/js/fancybox/jquery.easing-1.3.pack.js"></script>
    <script type="text/javascript" src="../../resources/js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
    <link rel="stylesheet" href="../../resources/js/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen"/>
    <link rel="stylesheet" type="text/css" media="screen" href="../../resources/css/start/jquery-ui-1.8.10.custom.css"/>
    <style type="text/css">
         * {
            font-family: Verdana;
            font-size: 96%;
        }

        label {
            width: 10em;
            float: left;
        }

        label.error {
            float: none;
            color: red;
            padding-left: .5em;
            vertical-align: top;
        }

        #informationTable, legend {
            font-size: 1.5em;
        }

        fieldset {
            padding: 0px 0px;
            margin: 0px 0px;
            border-color: transparent;
            /*border-width: 5;*/
            /*border-color: #009900;*/
            width: 800px;
            font: 8px Arial;
        }

       /* .ui-tabs-nav .ui-tabs-selected a span {
            color: white;
            font-weight: bold;
            padding: 0;
            height: 27px;
            background-position: 0 -23px;
            line-height: 27px;
        }*/

        p {
            clear: both;
        }

        .submit {
            margin-left: 12em;
        }

        em {
            font-weight: bold;
            padding-right: 1em;
            vertical-align: top;
        }

        .ui-tabs {
            font-size: 0.8em;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function() {

            $.getJSON('/get/likes', {idUser: "${employer.idUser}" ,amount:6}, function(data) {

                $.each(data, function(key, value) {
                    $('#listOfLikes').append('<li class="ui-state-default">' + '<a href = "/users/' + value.id + '">' + value.firstName + ' ' + value.lastName + '</a></li>');
                    $("#listOfLikes").sortable();
                    $("#listOfLikes").disableSelection();
                    //$(".ui-state-default").button();
                })
            })

            jQuery("#ed").fancybox({
                        'width'             : '75%',
                        'height'            : '94%',
                        'autoScale'         : false,
                        'transitionIn'      : 'none',
                        'transitionOut'     : 'none',
                        'type'              : 'iframe',
                        'hideOnOverlayClick': false
                    });

             $("#sendMessageHref").fancybox({
                    'width'             : '50%',
                    'height'            : '50%',
                    'autoScale'         : false,
                    'transitionIn'      : 'none',
                    'transitionOut'     : 'none',
                    'type'              : 'iframe'
                });

        $("#goToLikesHref").fancybox({
                    'width'             : '50%',
                    'height'            : '90%',
                    'autoScale'         : true,
                    'transitionIn'      : 'none',
                    'transitionOut'     : 'none',
                    'type'              : 'iframe'
                });

        });

       function closeIframe(reload,location) {

        $.fancybox.close();
        if (reload) {
            if (location) {
                window.location = location;
            } else {
                window.location.reload();
            }
        }
    }


        function edit() {
            $("#ed").click();
        }

        function sendMessage() {
        $("#sendMessageHref").click();
    }

    function goToLikes() {
        $("#goToLikesHref").click();
    }

        function addToLike() {
            $.getJSON('/like', {email: "${employer.email}" }, function(data) {
                alert(data.text);
            })
        }
    </script>
</head>
<body>
<div class="profile_top_left">
    <div class="profile_top">
        <div class="profile_left">
            <div class="profile_centr">
                <div class="profile_right">
                    <div class="photo_frame">
                        <img src="/employers/${employer.idUser}/getImage"/>
                    </div>
                </div>
                <div class="profile_menu_bar">
                    <security:authentication property="name" var="username"/>
                    <c:if test="${username != employer.email }">
                        <div>
                            <a id="sendMessageHref" hidden="hidden"
                               href="<c:url value="/messages/create?receiver=${employer.email}"/>"></a>
                            <input type="button" value="Отправить сообщение" onclick="sendMessage()"/>

                        </div>
                        <div><input type="button" value="Заинтересовало         "
                                    id="addToLike"
                                    onclick="addToLike()"/>
                        </div>
                    </c:if>
                    <c:if test="${not empty employer.likes }">
                    <div style="text-align: center; margin-top: 5px;">
                        Пользователю ${employer.firstName} ${employer.lastName} интересны:
                        <ol id="listOfLikes">
                        </ol>

                    </div>
                    <div style="text-align: left;">
                        <a id="goToLikesHref" hidden="hidden" href="/users/${employer.idUser}/likes"> </a>
                        <input type="button" value="Посмотреть всех        "
                                                          id="goToLikes"
                                                          onclick="goToLikes()"/>
                    </div>
                    </c:if>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="about_top_left">
<div class="about_top">
<div class="about_top_right">
<div class="about_right">
<div class="about_bottom_right">
<div class="about_bottom">
<div class="about_left_bottom">
<div class="about_left">
<div class="about_centr">
<div class="up_down_frame_top">
    <div class="up_down_frame_centr">
        <div class="text_for_up_frame" style="text-align: center;"><h1>${employer.firstName} ${employer.lastName}</h1></div>
        <div class="up_down_frame_bottom">
        </div>
    </div>
</div>

<div class="down_frame_centr">
<div class="text_for_up_frame">

                <fieldset class="fieldset">
                    <table id="informationTable">

                    <tr>
                        <td>Организация</td>
                        <td>${employer.organization}</td>
                    </tr>
                    <tr>
                        <td>Город</td>
                        <td>${employer.city.ruName}</td>
                    </tr>
                    <tr>
                        <td>Email</td>
                        <td>${employer.email}</td>
                    </tr>
                    <tr>
                        <td>Телефон</td>
                        <td>${employer.phone}</td>
                    <tr>
                        <td>Icq</td>
                        <td>${employer.icq}</td>
                    </tr>
                    <tr>
                        <td>Skype</td>
                        <td>${employer.skype}</td>
                    </tr>
                    <tr>
                        <td>О себе</td>
                        <td>${employer.about}</td>
                    </tr>

                    <tr>
                        <td>Типы работ</td>
                        <td>
                        <c:forEach var="jobType" items="${employer.jobTypes}">
                            ${jobType.title}
                        </c:forEach>
                        </td>
                    </tr>
                        </table>
                    <security:authorize ifAllGranted="ROLE_EMPLOYER">
                        <security:authentication property="name" var="username"/>
                        <c:if test="${username == employer.email }">
                            <p>
                                <a style="display: none;" id="ed" href="/employers/${employer.idUser}/edit"></a>
                                <input id="editAbout" style="font:12px Arial" type="button" value="Редактировать" onclick="edit();">
                            </p>
                        </c:if>
                    </security:authorize>

                </fieldset>

                </div>
                <div class="down_frame_bottom">
                </div>
                </div>


                </div>
                </div>
                </div>
                </div>
                </div>
                </div>
                </div>
                </div>
                </div>
                <div class="same_frame_top_left">
                    <div class="same_frame_top">
                        <div class="same_frame_right">
                            <div class="same_frame_bottom">
                                <div class="same_frame_left">
                                    <div class="same_frame_centr">
                                        <div class="red_frame">
                                            <div class="red_frame_cor">
                                                <div class="red_frame_bottom">
                                                    <div class="text_red_frame">Ближайшие работы</div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="up_down_orange_top">
                                            <div class="up_down_orange_centr">
                                                <div class="text_for_down_frame">
                                                    <ul>
                                                        <!--
                                                              <li>1. Листовки</li>
                                                              <li>2. Хреновки</li>
                                                              <li>3. Педровки</li>
                                                              <li>4. Листовки 100 грн в час</li></ul>
                                                              -->
                                                    </ul>
                                                </div>
                                                <div class="up_down_orange_bottom">
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="same_frame_top_left_bot">
                    <div class="same_frame_top">
                        <div class="same_frame_right">
                            <div class="same_frame_bottom">
                                <div class="same_frame_left">
                                    <div class="same_frame_centr_bot">
                                        <div class="red_frame">
                                            <div class="red_frame_cor">
                                                <div class="red_frame_bottom">
                                                    <div class="text_red_frame">Требуются такие работники</div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="up_down_frame_top"
                                             style="left:16px; top:60px; background-repeat:repeat-x; min-width:848px">
                                            <div class="up_down_frame_centr" style="min-width:848px">
                                                <div class="text_for_down_frame">
                                                    <ul>
                                                        <!--<li>1.rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr</li>
                                                              <li>1. dddddddddddddddddddddddddddddddddddddddddddddd</li>
                                                              <li>1. ppppppppppppppppppppppppppppppp</li>
                                                              <li>1. oooooooooooooooooooooooooooooooooooooooo</li>--></ul>
                                                </div>
                                                <div class="up_down_frame_bottom" style="background-repeat:repeat-x; min-width:848px">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

           <!--

            </td>
        </tr>
        <tr>
            <td height="100">
                Мне интересны:
                <ol id="listOfLikes">
                </ol>
            </td>
        </tr>
    </table>
</div>

<c:if test="${username != employer.email }">
    <div style="text-align: right;">[<a id="sendMessage"
                                        href="<c:url value="/messages/create?receiver=${employer.email}"/>">Send
        Message</a>]
    </div>
    <div style="text-align: right;">[<input type="button" value="Add to your likelist" id="#addToLike"
                                            onclick="addToLike()"/>]
    </div>
</c:if>
<c:if test="${username == employer.email }">
    <div style="text-align: right;">[<a id="#showMessages" href="<c:url value="/messages"/>">Show
        messages</a>]
    </div>
</c:if> -->
</body>


</html>